<template>
    <div>
        <h3>班级信息</h3>
    <el-table
    ref="multipleTable"
    :data="this.classes"
    tooltip-effect="dark"
    style="width: 100%"
    @selection-change="handleSelectionChange">
    <el-table-column
      type="selection"
      width="55">
    </el-table-column>
    <el-table-column
      prop="classid"
      label="班级编号"
      width="120">
      <!-- <template slot-scope="scope">{{ scope.row.date }}</template> -->
    </el-table-column>
    <el-table-column
      prop="classname"
      label="班级名"
      width="120">
    </el-table-column>
    <el-table-column
      prop="classinfo"
      label="班级信息"
      width="200"
      show-overflow-tooltip>
    </el-table-column>
    <el-table-column
      prop="coursenames"
      label="班级课程"
      width="400"
      show-overflow-tooltip>
    </el-table-column>
    <el-table-column label="操作">
      <template slot-scope="scope">
        <el-button
          size="mini"
          @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
        <el-button
          size="mini"
          type="danger"
          @click="handleDelete(scope.$index, scope.row)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
  
</div>
</template>

<script>
    import {mapState} from 'vuex';
    export default {
        name:'AdminClass',
        computed:{
            ...mapState('adminOptions',['classes']),
        },
        data(){
            return{
                multipleSelection: [],
            }
        },
        methods:{
            handleSelectionChange(val) {
                this.multipleSelection = val;
            },
             handleEdit(index, row) {
                console.log(index, row);
            },
            handleDelete(index, row) {
                console.log(index, row);
            }
      }
    }
</script>

<style>

</style>